import { ElMessage } from 'element-plus'
import 'element-plus/theme-chalk/el-message.css'
/* spu仓库模块 */
import { defineStore } from 'pinia'
/* 引入SPU模块接口 */
import {
  getBaseSpuAPI,
  getAllSpuAPI,
  getSaleAttributeAPI,
  getSpuImageAPI,
  getSaleAttrAPI,
  putUpdataSpuApi,
  deletSpuAPI,
} from '@/apis/goods/spu/index'
/* 引入 SPU 类型约束 */
import type {
  resSpuData,
  resAllMark,
  resAllSalesAttr,
  resSpuImage,
  resSales,
} from '@/apis/goods/spu/spuTypes'
import type { spuStateData } from '../types/spu'
export const userSpuState = defineStore('spu', {
  /* 数据仓库 */
  state: (): spuStateData => {
    return {
      BaseListSpu: {
        page: 1 /* 当前页码 */,
        limit: 10 /* 每页条数 */,
        category3Id: '' /* 3及分类ID */,
      },
      total: 0 /* 数据总条数 */,
      spuList: [] /* spu数据集合 */,
      upDataSpu: {
        category3Id: '',
        description: '',
        spuName: '',
        spuSaleAttrList: [],
        tmId: '',
        supImageList: [],
      } /* 选中修改的元素 */,
      toggleTable: '0',
      /* toggleTable为0显示spu的table 为1显示修改spu界面  2创建sku界面*/ allMark:
        [] /* 所有品牌数据 */,
      allSalesAttr: [] /* 整个项目全部的销售属性[颜色、版本、尺码] */,
      spuImg: [] /* 某个SPU下的全部的售卖商品的图片数据 */,
      saleList: [] /* 某一个SPU下全部的已有的销售属性接口地址 */,
    }
  },
  /* 同步逻辑 | 异步逻辑执行地方 */
  actions: {
    /* 获取已有spu信息 */
    async getBaseSpu(BaseListSpu: any) {
      const { data: res }: resSpuData = await getBaseSpuAPI(BaseListSpu)
      /* 对相应回来的数据进行校验 */
      if (res.code != 200) ElMessage.error(res.message)
      /* 获取成功 */
      this.total = res.data.total
      this.spuList = res.data.records
    },
    /* 获取所有的Spu商品  */
    async getAllSpu() {
      const { data: res }: resAllMark = await getAllSpuAPI()
      /* 对相应回来的数据进行校验 */
      if (res.code != 200) ElMessage.error(res.message)
      this.allMark = res.data
    },
    /* 获取某个SPU下的全部的售卖商品的图片数据 */
    async getSpuImageList(id: number) {
      const { data: res }: resSpuImage = await getSpuImageAPI(id)
      /* 对相应回来的数据进行校验 */
      if (res.code != 200) ElMessage.error(res.message)
      this.spuImg = res.data.map((item) => {
        return {
          name: item.imgName,
          url: item.imgUrl,
        }
      })
    },
    /* 获取某一个SPU下全部的已有的销售属性接口地址 */
    async getSpuSalesList(id: number) {
      const { data: res }: resSales = await getSaleAttrAPI(id)
      /* 对相应回来的数据进行校验 */
      if (res.code != 200) ElMessage.error(res.message)
      this.saleList = res.data
    },
    /* 获取整个项目全部的销售属性[颜色、版本、尺码] */
    async getAllSalesAttr() {
      const { data: res }: resAllSalesAttr = await getSaleAttributeAPI()
      /* 对相应回来的数据进行校验 */
      if (res.code != 200) ElMessage.error(res.message)
      this.allSalesAttr = res.data
    },
    /* 修改SPU 或者 添加SPU */
    async getUpdataSpu(data: any) {
      const { data: res }: any = await putUpdataSpuApi(data)
      /* 对相应回来的数据进行校验 */
      this.toggleTable = '0'
      this.getBaseSpu(this.BaseListSpu)
      if (res.code != 200) ElMessage.error(res.message)
      ElMessage({
        type: 'success',
        message: data.id ? '修改成功' : '添加成功',
      })
    },
    /* 删除已有SPU */
    async deletspu(id: number | string) {
      const { data: res }: any = await deletSpuAPI(id)
      /* 对相应回来的数据进行校验 */
      if (res.code != 200) ElMessage.error(res.message)
      ElMessage.success('删除成功')
      this.getBaseSpu(this.BaseListSpu)
    },
  },
})
